<template>
  <div class="main-container">
    <el-card
      class="box-card !border-none"
      shadow="never">
      <el-page-header
        :content="formData.id ? t('updateText') : t('addText')"
        :icon="ArrowLeft"
        @back="back()" />
    </el-card>

    <el-card
      class="box-card mt-[15px] !border-none"
      shadow="never">
      <el-tabs
        v-model="activeName"
        @tab-click="handleTabClick">
        <el-tab-pane
          :label="t('baseInfoTab')"
          name="1">
          <el-form
            :model="formData"
            label-width="120px"
            ref="baseFormRef"
            :rules="formRules"
            class="page-form">
            <el-form-item :label="t('liveStyle')">
              <el-radio-group
                v-model="formData.style"
              >
                <el-radio
                  :value="$convert(1, formData.style)"
                  :label="t('liveStyleHorizontally')"></el-radio>
                <el-radio
                  :value="$convert(0, formData.style)"
                  :label="t('liveStyleVertical')"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item
              :label="t('activityTitle')"
              prop="title">
              <el-input
                v-model.trim="formData.title"
                clearable
                :placeholder="t('activityTitlePlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
            <el-form-item
              :label="t('activityCategory')"
              prop="cate_id">
              <el-select
                v-model.trim="formData.cate_id"
                clearable
                :placeholder="t('activityCategoryPlaceholder')"
                class="min-w-[400px]">
                <el-option
                  v-for="item in categoryList"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id" />
              </el-select>
            </el-form-item>
            <el-form-item
              :label="t('uploadVideo')"
              prop="video_url">
              <upload-video
                :limit="1"
                width="120px"
                height="120px"
                v-model="formData.video_url" />
            </el-form-item>
            <el-form-item
              :label="t('videoDuration')"
              prop="video_time">
              <el-input
                v-model.number="formData.video_time"
                clearable
                :placeholder="t('videoDurationPlaceholder')"
                class="max-w-[400px]">
                <template #append>{{ t("videoDurationUnit") }}</template>
              </el-input>
            </el-form-item>
            <el-form-item :label="t('activityLiveTime')">
              <el-date-picker
                type="datetimerange"
                v-model="formData.play_date"
                value-format="YYYY-MM-DD HH:mm:ss"
                clearable
                :start-placeholder="t('activityLiveTimeStartPlaceholder')"
                :end-placeholder="t('activityLiveTimeEndPlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
            <el-form-item
              :label="t('activityPlaybackTime')">
              <el-date-picker
                type="datetimerange"
                v-model="formData.huifang_date"
                value-format="YYYY-MM-DD HH:mm:ss"
                clearable
                :start-placeholder="t('activityPlaybackTimeStartPlaceholder')"
                :end-placeholder="t('activityPlaybackTimeEndPlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
            <el-form-item :label="t('shareTitle')">
              <el-input
                v-model.trim="formData.share_title"
                clearable
                :placeholder="t('shareTitlePlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
            <el-form-item :label="t('shareDesc')">
              <el-input
                type="textarea"
                v-model.trim="formData.share_desc"
                clearable
                :placeholder="t('shareDescPlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
            <el-form-item :label="t('shareImage')">
              <div>
                <upload-image
                  v-model="formData.share_image"
                  :limit="1" />
                <div class="text-[#999] text-[12px]">
                  {{ t("shareImageTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item :label="t('backgroundImage')">
              <div>
                <upload-image
                  v-model="formData.back_image"
                  :limit="1" />
                <div class="text-[#999] text-[12px]">
                  {{ t("backgroundImageTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item :label="t('remindImage')">
              <div>
                <upload-image
                  v-model="formData.tips_src"
                  :limit="1" />
                <div class="text-[#999] text-[12px]">
                  {{ t("remindImageTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item
              :label="t('status')"
              prop="status">
              <el-radio-group v-model="formData.status">
                <el-radio-button
                  :value="$convert(1, formData.status)"
                  :label="t('statusOn')"></el-radio-button>
                <el-radio-button
                  :value="$convert(0, formData.status)"
                  :label="t('statusOff')"></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item :label="t('autoOnlineOrOffline')">
              <span class="mr-[10px]">{{ t("online") }}</span>
              <el-date-picker
                type="datetime"
                v-model="formData.online_time"
                value-format="x"
                clearable
                :placeholder="t('onlinePlaceholder')"
                class="w-[200px]" />
              <span class="mr-[10px] ml-[15px]">{{ t("offline") }}</span>
              <el-date-picker
                type="datetime"
                v-model="formData.offline_time"
                value-format="x"
                clearable
                :placeholder="t('offlinePlaceholder')"
                class="w-[200px]" />
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane
          :label="t('answerRewardTab')"
          name="2">
          <el-form
            :model="formData"
            label-width="120px"
            ref="answerFormRef"
            :rules="formRules"
            class="page-form">
            <el-form-item :label="t('answerSetting')">
              <span class="mr-[10px]">{{
                t("answerSettingText").split(",")[0]
              }}</span>
              <el-input
                v-model.number="formData.dati_time"
                clearable
                :placeholder="t('answerSettingPlaceholder')"
                class="max-w-[100px]" />
              <span class="ml-[10px]">{{
                t("answerSettingText").split(",")[1]
              }}</span>
            </el-form-item>
            <el-form-item
              prop="answerTimes"
              :label="t('answerTimes')">
              <div>
                <div>
                  <el-input
                    v-model.number="formData.daticount"
                    clearable
                    :placeholder="t('answerTimesPlaceholder').split(',')[0]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px]">{{
                    t("answerTimesText").split(",")[0]
                  }}</span>

                  <span class="mr-[10px] ml-[15px]">{{
                    t("answerTimesText").split(",")[1]
                  }}</span>
                  <el-input
                    v-model.number="formData.zhouqi"
                    clearable
                    :placeholder="t('answerTimesPlaceholder').split(',')[1]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px]">{{
                    t("answerTimesText").split(",")[2]
                  }}</span>

                  <span class="mr-[10px] ml-[15px]">{{
                    t("answerTimesText").split(",")[3]
                  }}</span>
                  <el-input
                    v-model.number="formData.tishu"
                    clearable
                    :placeholder="t('answerTimesPlaceholder').split(',')[2]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px]">{{
                    t("answerTimesText").split(",")[4]
                  }}</span>

                  <span class="mr-[10px] ml-[15px]">{{
                    t("answerTimesText").split(",")[5]
                  }}</span>
                  <el-input
                    v-model.number="formData.zhengqueshu"
                    clearable
                    :placeholder="t('answerTimesPlaceholder').split(',')[3]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px]">{{
                    t("answerTimesText").split(",")[6]
                  }}</span>
                </div>
                <div class="text-[#999] text-[12px]">
                  {{ t("answerTimesTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item
              :label="t('redMode')"
              prop="pay_model">
              <div>
                <el-radio-group v-model="formData.pay_model">
                  <el-radio-button
                    :value="$convert(1, formData.pay_model)"
                    :label="t('redModeText').split(',')[0]"></el-radio-button>
                  <el-radio-button
                    :value="$convert(2, formData.pay_model)"
                    :label="t('redModeText').split(',')[1]"></el-radio-button>
                  <el-radio-button
                    :value="$convert(3, formData.pay_model)"
                    :label="t('redModeText').split(',')[2]"></el-radio-button>
                </el-radio-group>
                <div class="text-[#999] text-[12px]">
                  {{ t("redModeTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item
              v-if="formData.pay_model !== 2"
              :label="t('redSetting')">
              <div>
                <div>
                  <span class="mr-[10px]">{{
                    t("redSettingText").split(",")[0]
                  }}</span>
                  <el-input
                    v-model.number="formData.hongbaocount"
                    clearable
                    :placeholder="t('redSettingPlaceholder').split(',')[0]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px] mr-[15px]">{{
                    t("redSettingText").split(",")[1]
                  }}</span>

                  <span class="mr-[10px]">{{
                    t("redSettingText").split(",")[2]
                  }}</span>
                  <el-input
                    v-model="formData.hongbao_min"
                    clearable
                    :placeholder="t('redSettingPlaceholder').split(',')[1]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px] mr-[15px]">{{
                    t("redSettingText").split(",")[3]
                  }}</span>

                  <span class="mr-[10px]">{{
                    t("redSettingText").split(",")[4]
                  }}</span>
                  <el-input
                    v-model.number="formData.jifen_min"
                    clearable
                    :placeholder="t('redSettingPlaceholder').split(',')[2]"
                    class="max-w-[100px]" />
                  <span class="ml-[10px] mr-[15px]">{{
                    t("redSettingText").split(",")[5]
                  }}</span>
                </div>
                <div class="text-[#999] text-[12px]">
                  {{ t("redSettingTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item :label="t('luckySetting')">
              <span class="mr-[10px]">{{
                t("luckySettingText").split(",")[0]
              }}</span>
              <el-input
                v-model.number="formData.fudai_shijian"
                clearable
                :placeholder="t('luckySettingPlaceholder').split(',')[0]"
                class="max-w-[100px]" />
              <span class="ml-[10px] mr-[15px]">{{
                t("luckySettingText").split(",")[1]
              }}</span>

              <span class="mr-[10px]">{{
                t("luckySettingText").split(",")[2]
              }}</span>
              <el-input
                v-model.number="formData.fudai_renshu"
                clearable
                :placeholder="t('luckySettingPlaceholder').split(',')[1]"
                class="max-w-[100px]" />
              <span class="ml-[10px] mr-[15px]">{{
                t("luckySettingText").split(",")[3]
              }}</span>

              <span class="mr-[10px]">{{
                t("luckySettingText").split(",")[4]
              }}</span>
              <el-input
                v-model.number="formData.fudai_meiren"
                clearable
                :placeholder="t('luckySettingPlaceholder').split(',')[2]"
                class="max-w-[100px]" />
              <span class="ml-[10px] mr-[15px]">{{
                t("luckySettingText").split(",")[5]
              }}</span>
            </el-form-item>
            <el-form-item :label="t('luckyAwardName')">
              <el-input
                v-model.trim="formData.fudai_name"
                clearable
                :placeholder="t('luckyAwardNamePlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
            <el-form-item :label="t('luckyComment')">
              <el-input
                type="textarea"
                v-model.trim="formData.fudai_pinglun"
                clearable
                :placeholder="t('luckyCommentPlaceholder')"
                class="max-w-[400px]" />
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane
          :label="t('rewardTab')"
          name="3">
          <el-form
            :model="formData"
            label-width="120px"
            ref="rewardFormRef"
            :rules="formRules"
            class="page-form">
            <el-form-item :label="t('encryptViewingOpen')">
              <el-radio-group
                v-model="formData.play_pwd_open">
                <el-radio-button
                  :value="$convert(1, formData.play_pwd_open)"
                  :label="
                    t('encryptViewingOpenText').split(',')[0]
                  "></el-radio-button>
                <el-radio-button
                  :value="$convert(0, formData.play_pwd_open)"
                  :label="
                    t('encryptViewingOpenText').split(',')[1]
                  "></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item
              v-if="formData.play_pwd_open == 1"
              :label="t('encryptViewing')">
              <div>
                <el-input
                  v-model.trim="formData.play_pwd"
                  clearable
                  :placeholder="t('encryptViewingPlaceholder')"
                  class="min-w-[400px]" />
                <div class="text-[#999] text-[12px]">
                  {{ t("encryptViewingTips") }}
                </div>
              </div>
            </el-form-item>
            <!-- <el-form-item :label="t('levelLimit')">
                    <div>
                      <el-input v-model.trim="formData.goods_name" clearable :placeholder="t('levelLimitPlaceholder')" class="min-w-[400px]" />
                      <div class="text-[#999] text-[12px]">{{ t('levelLimitTips') }}</div>
                    </div>
                  </el-form-item>
                  <el-form-item :label="t('tagLimit')">
                    <div>
                      <el-input v-model.trim="formData.goods_name" clearable :placeholder="t('tagLimitPlaceholder')" class="min-w-[400px]" />
                      <div class="text-[#999] text-[12px]">{{ t('tagLimitTips') }}</div>
                    </div>
                  </el-form-item> -->
          </el-form>
        </el-tab-pane>
        <el-tab-pane
          :label="t('autoLabelTab')"
          name="4">
          <el-form
            :model="formData"
            label-width="120px"
            ref="tagFormRef"
            :rules="formRules"
            class="page-form">
            <el-form-item :label="t('autoLabel')">
              <el-radio-group v-model="formData.auto_tag_status">
                <el-radio-button
                  :value="$convert(1, formData.auto_tag_status)"
                  :label="t('autoLabelText').split(',')[0]"></el-radio-button>
                <el-radio-button
                  :value="$convert(0, formData.auto_tag_status)"
                  :label="t('autoLabelText').split(',')[1]"></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item v-if="formData.auto_tag_status == 1">
              <el-table
                :data="formData.auto_tag_list"
                class="mt-[10px]">
                <el-table-column
                  prop="name"
                  :label="t('autoLabelColumn').split(',')[0]"
                  width="200" />
                <el-table-column
                  prop="value"
                  :label="t('autoLabelColumn').split(',')[1]" />
                <el-table-column
                  prop="value"
                  :label="t('autoLabelColumn').split(',')[2]"
                  width="100">
                  <template #default="scope">
                    <el-button
                      type="primary"
                      size="small"
                      >{{ t("autoLabelSet") }}</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane
          :label="t('otherInfoTab')"
          name="5">
          <el-form
            :model="formData"
            label-width="120px"
            ref="otherFormRef"
            :rules="formRules"
            class="page-form">
            <el-form-item :label="t('virtualViewers')">
              <div>
                <el-input
                  v-model.trim="formData.playnum"
                  clearable
                  :placeholder="t('virtualViewersPlaceholder')"
                  class="min-w-[400px]" />
                <div class="text-[#999] text-[12px]">
                  {{ t("virtualViewersTips") }}
                </div>
              </div>
            </el-form-item>
            <el-form-item :label="t('answerSwitch')">
              <el-radio-group v-model="formData.is_open_answer">
                <el-radio-button
                  :value="$convert(1, formData.is_open_answer)"
                  :label="t('answerSwitchText1')"></el-radio-button>
                <el-radio-button
                  :value="$convert(0, formData.is_open_answer)"
                  :label="t('answerSwitchText0')"></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item :label="t('commentSwitch')">
              <el-radio-group v-model="formData.chat_open">
                <el-radio-button
                  :value="$convert(1, formData.chat_open)"
                  :label="t('commentSwitchText1')"></el-radio-button>
                <el-radio-button
                  :value="$convert(0, formData.chat_open)"
                  :label="t('commentSwitchText0')"></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item :label="t('contentSwitch')">
              <el-radio-group v-model="formData.is_open_desc">
                <el-radio-button
                  :value="$convert(1, formData.is_open_desc)"
                  :label="t('contentSwitchText1')"></el-radio-button>
                <el-radio-button
                  :value="$convert(0, formData.is_open_desc)"
                  :label="t('contentSwitchText0')"></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item :label="t('content')">
              <editor
                v-model="formData.detail"
                :height="600" />
            </el-form-item>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </el-card>

    <div class="fixed-footer-wrap">
      <div class="fixed-footer">
        <el-button
          type="primary"
          @click="save()"
          >{{ t("save") }}</el-button
        >
        <el-button @click="back()">{{ t("back") }}</el-button>
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { ArrowLeft } from "@element-plus/icons-vue";
import { t } from "@/lang";
import { onMounted, ref, watch, getCurrentInstance } from "vue";
import { useRoute, useRouter } from "vue-router";
import {
  addActivityApi,
  editActivityApi,
  getActivityInfoApi,
  getCategoryAllApi,
} from "@/addon/htscrm/api";
import { cloneDeep, debounce } from "lodash-es";
import { FormInstance } from "element-plus";

const instance = getCurrentInstance() as any
const { $convert } = instance?.appContext.config.globalProperties || {}

const router = useRouter();
const route = useRoute();
// 当前tab
const activeName = ref("1");

const baseFormRef = ref<FormInstance>();
const rewardFormRef = ref<FormInstance>();
const answerFormRef = ref<FormInstance>();
const tagFormRef = ref<FormInstance>();
const otherFormRef = ref<FormInstance>();
// 所属分类id
const activeId = ref<number | null>(
  route.query.activeId ? +route.query.activeId : null
);

// 表单数据
const formData = ref<IActivityItem>({
  title: "",
  image: "",
  addtime: null,
  status: 1,
  sort: null,
  daticount: 1,
  hongbao_min: "",
  hongbao_max: "",
  hongbaocount: null,
  video_url: "",
  hongbao_shengyu: null,
  qrcode: "",
  hit: null,
  share_image: "",
  share_title: "",
  share_desc: "",
  jifen: null,
  zhouqi: null,
  jifen_min: null,
  jifen_max: null,
  tishu: null,
  video_type: "",
  zhengqueshu: null,
  type: null,
  video_time: null,
  audio_image: "",
  audio_poster: null,
  tishi: null,
  choujiang_count: null,
  cate_id: activeId.value,
  play_start: null,
  play_end: null,
  play_pwd: "",
  play_pwd_open: 0,
  play_date: [],
  huifang_date: [],
  playnum: null,
  dati_time: null,
  pay_model: 1,
  banner: null,
  detail: null,
  back_image: "",
  content: "",
  online_time: null,
  offline_time: null,
  auto_offline_mqid: "",
  auto_online_mqid: "",
  fudai_shijian: null,
  fudai_renshu: null,
  fudai_meiren: null,
  fudai_name: "",
  fudai_pinglun: "",
  fudai_starttime: null,
  fudai_endtime: null,
  fudai_changci: null,
  fudai_status: null,
  live_push_url: null,
  dati_date: null,
  tips_src: "",
  auto_tag_status: 0,
  style: 1, // 屏幕方向
  is_open_answer: 1, // 是否开启问答
  chat_open: 0, // 是否开启评论
  is_open_desc: 1, // 是否开启内容
  auto_tag_list: [
    {
      type: 1,
      name: "到课",
      tags: [],
    },
    {
      type: 2,
      name: "完播",
      tags: [],
    },
  ],
});
// 表单验证
const validateAnswerTimes = (rule: any, value: any, callback: any) => {
  if (!formData.value.daticount || formData.value.daticount < 1) {
    callback(new Error("请输入正确的答题次数"));
    return;
  }
  if (!formData.value.zhouqi || formData.value.daticount < 1) {
    callback(new Error("请输入正确的答题周期"));
    return;
  }
  if (!formData.value.tishu || formData.value.daticount < 1) {
    callback(new Error("请输入正确的每次抽的题数"));
    return;
  }
  if (!formData.value.zhengqueshu || formData.value.daticount < 1) {
    callback(new Error("请输入答题正确获得奖励的题数"));
    return;
  }
  callback();
};
const validateActivityPlaybackTime = (rule: any, value: any, callback: any) => {
  if (!formData.value.huifang_date) {
    callback(new Error("请输入回放时间"));
    return;
  }
  callback();
};
const formRules = ref({
  title: [{ required: true, message: t("activityTitleTip"), trigger: "blur" }],
  cate_id: [{ required: true, message: t("activityCateTip"), trigger: "blur" }],
  video_url: [{ required: true, message: "请上传视频", trigger: "blur" }],
  video_time: [{ required: true, message: "请输入视频时长", trigger: "blur" }],
  status: [{ required: true, message: t("statusTip"), trigger: "blur" }],
  pay_model: [{ required: true, message: t("payModelTip"), trigger: "blur" }],
  answerTimes: [
    { required: true, validator: validateAnswerTimes, trigger: "blur" },
  ],
  activityPlaybackTime: [
    {
      required: true,
      validator: validateActivityPlaybackTime,
      trigger: "blur",
    },
  ],
});

const categoryList = ref<any[]>([]);

const isInit = ref(true);
const isChanged = ref(false);

/**
 * tab切换
 */
function handleTabClick() {}

async function getDetail() {
  if (!route.query.id) return;
  const res = await getActivityInfoApi(Number(route.query.id));
  // 处理时间段数据
  res.data.play_date = res.data.play_date
    ? (res.data.play_date as any).split(" 到 ")
    : [];
  res.data.huifang_date = res.data.huifang_date
    ? (res.data.huifang_date as any).split(" 到 ")
    : [];
  res.data.online_time = res.data.online_time
    ? new Date(res.data.online_time).getTime()
    : null;
  res.data.offline_time = res.data.offline_time
    ? new Date(res.data.offline_time).getTime()
    : null;
  // 自动标签
  res.data.auto_tag_list = res.data.auto_tag_list ?? [
    {
      type: 1,
      name: "到课",
      tags: [],
    },
    {
      type: 2,
      name: "完播",
      tags: [],
    },
  ];
  formData.value = res.data;
}

async function getCategoryAll() {
  const res = await getCategoryAllApi();
  categoryList.value = res.data;
}

/**
 * 返回
 */
function back() {
  router.back();
}

function validate(name: string, formRef?: FormInstance) {
  return new Promise((resolve, reject) => {
    formRef?.validate((valid, errors) => {
      if (valid) {
        resolve(true);
      } else {
        activeName.value = name;
        reject(errors);
      }
    });
  });
}

/**
 * 保存
 */
const save = debounce(async (isBack: boolean = true) => {
  await validate("1", baseFormRef.value);
  await validate("2", answerFormRef.value);
  await validate("3", rewardFormRef.value);
  await validate("4", tagFormRef.value);
  await validate("5", otherFormRef.value);
  if (isChanged.value === false) {
    back();
    return;
  }
  const params: any = cloneDeep(formData.value);
  params.play_date = params.play_date ? params.play_date.join(" 到 ") : "";
  params.huifang_date = params.huifang_date
    ? params.huifang_date.join(" 到 ")
    : "";
  // params.daoke_tag_ids = params.auto_tag_list[0].tags
  // params.wanbo_tag_ids = params.auto_tag_list[1].tags
  params.offline_time = params.offline_time
    ? parseInt(String(params.offline_time / 1000))
    : 0;
  params.online_time = params.online_time
    ? parseInt(String(params.online_time / 1000))
    : 0;
  delete params.auto_tag_list;
  params.id ? await editActivityApi(params) : await addActivityApi(params);

  isChanged.value = false;
  isBack && back();
});

watch(
  () => formData,
  () => {
    // console.log(formData);
    console.log("内容变了");
    if (!isInit.value) {
      isChanged.value = true;
    }
    isInit.value = false;
  },
  { deep: true }
);

// 路由守卫，退出判断
// onBeforeRouteLeave(async (to, from, next) => {
//     if (isChanged.value) {
//         const res = await ElMessageBox.confirm('是否保存修改？', '系统提示', {
//             type: 'warning'
//         })
//         if (res) {
//             try {
//                 await save(false)
//                 next()
//             } catch (error) {
//                 next()
//             }
//         }
//     } else {
//         next()
//     }
// })

onMounted(() => {
  getDetail();
  getCategoryAll();
});
</script>

<style lang="scss">
.fixed-footer-wrap {
  z-index: 9999 !important;
}
</style>
